<template>
    <div>

      <view-router></view-router>

       <!-- <div class="container-fluid" id="top-bar" hidden-sm hidden-xs > -->
         <div class="container-fluid visible-md visible-lg " id="top-bar"  >
        <div class="row">
    <div class="col-md-3  " id="q"  >
     <a id="aa" href="">
       <span class="glyphicon glyphicon-phone"></span>
      <span>手机微金所</span> 
     <span class="glyphicon glyphicon-chevron-down"></span>
     <img  id="img-hover" src="./images/二维码.png" alt=""  width="100px" height="100px"    >
     </a>
  </div>
  <div class="col-md-4" id="q">
    <span class="glyphicon glyphicon-earphone"></span>
    <span>4000-168-192(服务时间:9:00--20:30)</span>
  </div>
  <div class="col-md-2" id="q">
  <a href="">
    <span> 常见问题;财富登录</span>
  </a>
  </div>
   <div class="col-md-3" id="q1">
     <button id="danger" type="button" class="btn btn-danger"    >注册</button>
     <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
	登录
</button>
<!-- 模态框（Modal） --> 
 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
			
				<h4 class="modal-title" id="myModalLabel">
				用户名<input type="text">
				</h4>
			</div>
		<div class="modal-header">
				<h4 class="modal-title" id="myModalLabel">
				密码<input type="text">
				</h4>
			</div>
			<div class="modal-footer">
				
				<button type="button" class="btn btn-primary">
					登录
				</button>

        <button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
			</div>
		</div>
	</div>
</div>

   </div>
        </div>
    </div>


<nav class="navbar navbar-expand-md bg-info navbar-dark">
  <!-- <a  id="font_wei" class="navbar-brand" href="#">
    <span class="glyphicon glyphicon-euro"></span>
    <span>微金所</span>
    </a>       兼容设置   -->
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="collapsibleNavbar">
    <ul class="navbar-nav">
        <li class="nav-item">
        <a  id="font_wei" class="navbar-brand" href="#">
    <span class="glyphicon glyphicon-euro"></span>
    <span>微金所</span>
    </a>
      </li>
      
      <li class="nav-item">
        <a id="font_nav" class="nav-link" href="#">我要投资</a>
      </li>
      <li class="nav-item">
        <a  id="font_nav" class="nav-link" href="#">我要借款</a>
      </li>
      <li class="nav-item">
        <a id="font_nav" class="nav-link" href="#">平台介绍</a>
      </li>    
       <li class="nav-item">
        <a id="font_nav" class="nav-link" href="#">新手专区</a>
      </li>   
       <li class="nav-item">
        <a  id="font_nav" class="nav-link" href="#">最新动态</a>
      </li>   
       <li class="nav-item">
        <a  id="font_nav" class="nav-link" href="#">微论坛</a>
      </li> 

    </ul>
    <router-link to="/person"  id="font_user" class="navbar-brand" href="#" style="float:right">
    <span class="glyphicon glyphicon-user"></span>
    <span>个人中心</span>
    </router-link>
  </div>  
</nav>








<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"  data-interval="1500">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <img  id="slide_img"  src="./images/6.jpg" height="330px" alt="">
      <div class="carousel-caption">
        123
      </div>
    </div>
    <div class="item">
      <img  id="slide_img"  src="./images/3.jpg" height="330px" alt="">
      <div class="carousel-caption">
        456
      </div>
    </div>
     <div class="item">
      <img  id="slide_img" src="./images/7.jpg"  alt="">
      <div class="carousel-caption">
       789
      </div>
    </div>
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>





<div class="container  visible-sm visible-md visible-lg " >

	<div class="row ">
		
				<div class="col-md-4 col-sm-6 column">
           <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车1.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">支付交易保证</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
				<div class="col-md-4  col-sm-6 column">
           <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车5.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">支付交易保证</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
				<div class="col-md-4   col-sm-6 column">
             <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车4.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">支付交易保证</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
	
				<div class="col-md-4   col-sm-6 column">
               <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车3.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">支付交易保证</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
				<div class="col-md-4   col-sm-6 column">
               <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车2.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">支付交易保证</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
				<div class="col-md-4   col-sm-6 column">
                <a href="#" id="feature_icon" >
        <div class="media">
          <div class="media-left">
            
       <img class="media-object" src="../项目2/images/汽车6.jpg" alt="" width="40px" height="40px">
             
       </div>
  <div class="media-body">
    <h4 class="media-heading">银联支付全程保证资金安全</h4>
    银联支付全程保证资金安全
  </div>
      </div>
      </a>
				</div>
		


		</div>
</div>

<hr >

 <div id="hr_" class="container ">
   <p class="full-left visible-md visible-lg " > <i class="glyphicon glyphicon-comment"></i>  银联支付全程保证资金安全!银联支付全程保证资金安全 现在已有108782人预约  &nbsp;&nbsp;&nbsp; <span style="color:red " >立即预约</span> </p>
  <p class="full-right"><span class="glyphicon glyphicon-film"></span>微金所企业宣传片</p>
 </div>

<hr>

 <div id="products">

   <div class="container" >
         <!-- Nav tabs -->
  <div id="scoll">
    <ul class="nav nav-tabs" role="tablist" id="panel_head">
    <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">特别推荐</a></li>
    <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">微投资</a></li>
    <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">微小宝</a></li>
    <li role="presentation"><router-link to="/doctor" href="#settings" aria-controls="settings" role="tab" data-toggle="tab">牙科专区</router-link></li>
    <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">微金宝</a></li>
    <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">微增利</a></li>
      <li id="more" ><a href="#more" role="tab" data-toggle="tab">更多...</a></li>
  </ul>
  </div>

  

  <!-- 横向标签 -->
  <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="home">
      
      <div class="row ">
		
				<div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">在此过程中，工党获得了创新新闻管理的美誉，而后来被证实是…</div>
              <div class="panel-body">
         <p>In the process, Labour acquired a reputation for creative news management that proved damaging later</p>
          </div>
				</div>
      </div>
      <div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">为了便于对网站新闻进行有效的管理，非常有必要开发一个网站新闻管理系统。</div>
              <div class="panel-body">
         <p>For easy to effectively administrate the website news, it is really necessary to develop a website news management system</p>
          </div>
				</div>
      </div>
      <div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">本文比较了现有网站新闻管理系统设计的方法，指出其不足之处，并通过一实例阐述了使用ASP。</div>
              <div class="panel-body">
         <p>The essay compares the design methods of news management system at current web stations, points out the weakness,</p>
          </div>
				</div>
      </div>
      <div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">根据不同时间段内的不同任务和目标，公众外交可以划分为新闻管理、战略协调和关系建立等三个维度；</div>
              <div class="panel-body">
         <p>According to a different time scale, we can characterize three dimensions of public diplomacy activities: news management, strategic communication and relationship </p>
          </div>
				</div>
      </div>
      <div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">究其原因，从根本上来说，与我们的新闻管理体制有关，即舆论监督在我国大多要得到官方的事先认可</div>
              <div class="panel-body">
         <p>It is due to the managerial system of the press in our country, which results in the fact that supervision by public opinion must be authorized by the government beforehand. </p>
          </div>
				</div>
      </div>
      <div class="col-md-4 col-sm-6 column">
           <div class="panel panel-primary">
        
            <div class="panel-heading">进行新闻业管理观念和方法的创新，这是当今社会政治、经济、文化发展以及新闻业自身发展所提出的要求。</div>
              <div class="panel-body">
         <p>With the development of social politics, economy and culture and the development of journalism, innovating the managing conception and methods of journalism becomes necessary </p>
          </div>
				</div>
      </div>

    </div>

    </div>
    <div role="tabpanel" class="tab-pane" id="profile">
      <div class="row ">
		
				<div class=" col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success">
        
            <div class="panel-heading">它带有一个新闻管理器、折扣优惠、电子礼券以及其他你期望的基础功能。</div>
              <div class="panel-body">
         <p>It comes with a newsletter manager, discount coupons, gift certificates and all the basic features you’d expect.</p>
          </div>
				</div>
      </div>
      <div class="col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success">
        
            <div class="panel-heading">总之，本文的研究成果对于网络新闻管理具有重要的应用价值，对舆情检测和管理具有很好的借鉴作用。</div>
              <div class="panel-body">
         <p>In a word, this research has important application value on personal internet news management, and has reference value on public opinion monitoring and management.</p>
          </div>
				</div>
      </div>
      <div class="col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success">
        
            <div class="panel-heading">首先可通过着手网络实名制的立法工作来完善网络新闻管理的法律法规体系；</div>
              <div class="panel-body">
         <p>First, it can improve the management of network news laws and regulations by taking up the legislative work and internet real-name system</p>
          </div>
				</div>
      </div>
      <div class=" col-xs-4 col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success">
        
            <div class="panel-heading">后台新闻管理系统实现了对新闻的各项管理。</div>
              <div class="panel-body">
         <p>Backgrounds news management system for implementation of the management information. </p>
          </div>
				</div>
      </div>
      <div class="  col-xs-4 col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success">
        
            <div class="panel-heading">进行新闻业管理观念和方法的创新，这是当今社会政治、经济、文化发展以及新闻业自身发展所提出的要求。</div>
              <div class="panel-body">
         <p>With the development of social politics, economy and culture and the development of journalism, innovating the managing conception and methods of journalism becomes necessary.</p>
          </div>
				</div>
      </div>
      <div class=" col-xs-4 col-sm-4 col-md-4 col-sm-6 column">
           <div class="panel panel-success  ">
        
            <div class="panel-heading">最后，本文对我国的新闻自由现状进行了梳理，对于我国的新闻管理的方法和不足进行了分析，并提出了自己的建议。</div>
              <div class="panel-body">
         <p>By analyzing the conflicts among press freedom, other citizen rights and national interests, an approach to limit press freedom by law is put forward.</p>
          </div>
				</div>
      </div>

    </div>
    </div>
    <div role="tabpanel" class="tab-pane" id="messages">
      <form>
  <div class="form-group">
    <label for="exampleInputEmail1">Email address</label>
    <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
  </div>
  <div class="form-group">
    <label for="exampleInputPassword1">Password</label>
    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
  </div>
  <div class="form-group">
    <label for="exampleInputFile">File input</label>
    <input type="file" id="exampleInputFile">
    <p class="help-block">Example block-level help text here.</p>
  </div>
  <div class="checkbox">
    <label>
      <input type="checkbox"> Check me out
    </label>
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>
    </div>
    <div role="tabpanel" class="tab-pane" id="settings">...</div>
  </div>

 </div>

 </div>

 <hr>

<!-- 新闻模块 -->

<div class="container"  id="newlist"   >
<div class="row">
   <div class="col-md-2 col-md-offset-2">
    <h1 style="color:red" >名人名言 </h1>
    <p><span class="glyphicon glyphicon-leaf"></span>-------------<span class="glyphicon glyphicon-fire"></span></p>
   </div>
    <div class="col-md-1" >

      <ul class="nav nav-tabs" role="tablist">
     <li role="presentation" class="active"><a href="#zero" aria-controls="home" role="tab" data-toggle="tab"  ><i style="color:red" class="glyphicon glyphicon-globe" width="40px" height="40px" ></i></a></li>
      <li role="presentation" ><a href="#one" aria-controls="home" role="tab" data-toggle="tab"><i class="glyphicon glyphicon-heart-empty" style="color:red" ></i></a></li>
       <li role="presentation" ><a href="#two" aria-controls="home" role="tab" data-toggle="tab"><i style="color:red"  class="glyphicon glyphicon-link"></i></a></li>
       <li role="presentation" ><a href="#three" aria-controls="home" role="tab" data-toggle="tab"><i style="color:red"  class="glyphicon glyphicon-send"></i></a></li>
       </ul>

    </div>
    <div class=" col-md-7">

         <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="zero">
      
      <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标7.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">欧文</h4>
真理惟一可靠的标准就是永远自相符合
  </div>
</div>

       <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标2.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">斯里兰卡</h4>
世界上一成不变的东西，只有“任何事物都是在不断变化的”这条真理。
  </div>
</div>

    <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标9.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">赫尔巴特</h4>
相信谎言的人必将在真理之前毁灭。
  </div>
</div>

  <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标8.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">莎士比亚</h4>
笨蛋自以为聪明，聪明人才知道自己是笨蛋。
  </div>
</div>

    </div>
    <div role="tabpanel" class="tab-pane" id="one">
      
      <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标8.png" alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">德奥弗拉斯多</h4>
时间是一切财富中最宝贵的财富。
  </div>
      </div>

       <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标10.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">欧文</h4>
真理惟一可靠的标准就是永远自相符合
  </div>
</div>

       <div class="media">
  <div class="media-left">
    <a href="#">
      <img class="media-object" src="./images/新闻图标9.png"  alt="..." width="40px" height="40px" >
    </a>
  </div>
  <div class="media-body">
    <h4 class="media-heading">斯里兰卡</h4>
世界上一成不变的东西，只有“任何事物都是在不断变化的”这条真理。
  </div>
</div>

    </div>
    <div role="tabpanel" class="tab-pane" id="two">789</div>
    <div role="tabpanel" class="tab-pane" id="three">890</div>
         </div>

    </div>  

</div>

</div>


<hr>


<div class="footer">
  <div class="container"  >
      <h1>合作伙伴</h1>
     <ul class="nav"  >
    <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动1.jpg"  alt="..." width="40px" height="40px" >
    </a>
    </li>
    <li class="nav-item">
       <a href="#">
      <img class="media-object" src="./images/运动2.jpeg"  alt="..." width="40px" height="40px" >
    </a>
    </li>
    <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动3.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
   <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动4.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
      <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动5.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
     <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动6.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
     <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动7.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
      <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动8.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
      <li class="nav-item">
      <a href="#">
      <img class="media-object" src="./images/运动9.jpg"   alt="..." width="40px" height="40px" >
    </a>
    </li>
  </ul>
  </div>



</div>




 



  



   <!-- <div class="slide">


   </div> -->




    </div>
</template>



<style scoped>

#danger{
  width: 51px;
  height: 32px;
 
}

#top-bar{
  height:40px ;
 
  border: 1px solid gray ;
  
}
#q{
  text-align: center;
  top: 10px;
  /* border-right: 1px solid gray ; */
 
}
#q1{
  top: 5px;
  text-align: center;
}
a{
  text-decoration: none ;
  cursor: pointer ;
}
#img-hover{
  display: none ;
}
#aa:hover  #img-hover{
  display: block;
  position: relative;
  left: 95px;
  z-index: 9999;
  
}
#font_wei{
  font-size: 30px ;
  color: red ;
  font-style: italic;
  width: 200px;
  top: -8px;
  position: relative;
}
#font_nav{
  font-size: 13px;
}
#font_user{
  color: green;
  font-size: 13px;
   position: relative;
   top:   13px;
   right: -100px;
}
  #font_user:hover{
  color: aqua;
}
#font_nav:hover{
  font-size: 20px;
}
#carousel-example-generic{
  top: -19px;
}

#slide_img{
   height: 330px ;
   text-align: center;
   width: 100%;
}









#feature{
  width: 40px;
  height: 40px;
}

.row >div{
  margin-bottom: 35px;
}
#feature_icon{
  color: black ;

}
#feature_icon:hover{
  color: red;
}
 .container > .full-left{
  
  float: left;
 
}  
 .container > .full-right{
  float: right;   
 
}


#products{
  background-color: #f0f0f0;
  height: 100% ;
  top: -12px;
  position: relative;
}
 #products > .container > ul > li > a{
  color: black;
 }
  /* #products > .container  > #more1  {  

    /* 改变更多的样式 
  float: right;
  font-size: 15px;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  color: black;
  position: relative;
  list-style: none;
  top: -30px;
  
  
} */
#products > .container > div {
    overflow-x:scroll ;
    
}
div::-webkit-scrollbar {
    display: none;
}
#products > .container > ul > li{
  float: left;
}
#products > .container  > ul > #more{
  float: right;
  font-size: 15px;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  color: black;
} 

#panel_head > li{
  font-size: 15px;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  

}

#products > .container > div>ul > li > a:hover{
  color: red;
  /* font-size: 13px; */

}
#myTabContent{
    height: 100%;
}



#newlist{
  padding: 20px;
  height: auto;
  width: 100%;
 
  font-family: Georgia, 'Times New Roman', Times, serif;
}










/* .slide{
  background-color: brown ;
  height: 330px;
} */



.footer{
  height: 120px;  
  
}
.footer > .container >h1{
  text-align: center;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  
}
.footer > .container > ul{
  text-align: center;
   
}
.footer > .container > ul > li{
 padding: 0 23px;
   
}



</style>


<script>


  

export default {
    data(){
        return {
            meal: ''
        }
    },
    created(){

      this.getMeal()  ,
      this.getMeal1()
    },
    methods:{
      getMeal(){
      
       $(function(){
          
       var $ulbox= $('#panel_head');
       var width=0;
       //找到ul中所有的li子元素
       $ulbox.children().each(function(index,element){
          width +=   element.clientWidth;
          //  alert($(element).width());
          
       });
       $ulbox.css('width' , width);
        
        

       });
        

      },
      getMeal1(){
        
         $('.carousel').carousel({
           interval: 1000
            });
      }
     
      

      }
  
      }

        

       

    

</script>